倒數第二天了,最後的最後,還是要來聊一下 Laravel 的自動測試。
之前我們談過了整合測試,實際存取資料庫的測試,還有單元測試。
今天,我們要來聊網頁開發很重要的瀏覽器模擬測試
顧名思義,瀏覽器模擬測試,就是用程式運作一個瀏覽器的程式,來模擬使用者的操作。
因為真的會用瀏覽器,所以跟之前我們所做的,純透過程式進行的測試,本質上有著很大的不同。
雖然我們做了很多測試,保證了每個元件個別的邏輯都正確,但是面對真正網頁的行為:用瀏覽器看網頁的畫面,還是有可能會出錯的。
面對絕對不能出錯的功能,要能正確的測試用戶可能會遇到的問題,有時確實必須用瀏覽器來驗證這些功能。
要做瀏覽器測試,有時候是個很麻煩的事情。你要安裝能用程式驅動的瀏覽器,撰寫瀏覽器的腳本⋯⋯等等。
幸運的是,針對瀏覽器模擬測試,Laravel 有一個官方的套件可以使用。
我們只要運作
$ composer require --dev laravel/dusk
就可以安裝套件。
要設置套件,要再運作一個指令
$ php artisan dusk:install
作為官方工具,使用起來也和 Laravel 一樣好用,我們用
$ php artisan dusk:make BrowserTest
Test created successfully.
進到 tests
資料夾,我們發現多了一個 Browser
資料夾,裡面除了我們建立的 BrowserTest
之外,還有一個 ExampleTest
public function testBasicExample()
{
$this->browse(function (Browser $browser) {
$browser->visit('/')
->assertSee('Laravel');
});
}
這個測試很直觀,就是用一個瀏覽器,連線 http://127.0.0.1/ 要能看到 Laravel 這串字。
我們可以用指令運作一下瀏覽器測試,測試指令是 php artisan dusk
$ php artisan dusk
PHPUnit 7.5.15 by Sebastian Bergmann and contributors.
.. 2 / 2 (100%)
Time: 1.88 seconds, Memory: 18.00 MB
OK (2 tests, 2 assertions)
如果我們改一下畫面,把 resources/views/welcome.blade.php
的 「Laravel」改成「Lara」
<div class="title m-b-md">
Lara
</div>
然後我們跑一下測試,就會發現確實失敗了。
接著,我們修改一下我們剛剛建立的測試程式碼。讓這個測試建立一個新用戶,並且跑到登入頁面嘗試登入
public function testExample()
{
$user = factory(User::class)->create([
'email' => 'taylor@laravel.com',
]);
$this->browse(function ($browser) use ($user) {
$browser->visit('/login')
->type('email', $user->email)
->type('password', 'password')
->press('Login')
->assertPathIs('/home');
});
}
正確操作過後,我們等一陣子,就可以看到這個測試通過了。
其餘的操作非常多,基本上瀏覽器可以做到的事情,Laravel Dusk 都可以做到。如果對繼續研究下去有興趣的人,歡迎到 https://laravel.com/docs/6.x/dusk 繼續研究。
除了 Laravel Dusk 之外,Laravel 還提供了非常多的套件,供網站開發之外使用。比方說
林林總總的套件還有非常多,就等各位去慢慢發掘了。
小小總結一下今天我們學到些什麼。
今天我們學到了什麼是瀏覽器模擬測試,為什麼要做,怎麼用 Laravel Dusk 套件製作瀏覽器模擬測試,還有各種 Laravel 套件。
希望今天各位覺得有收穫,我們明天見!